<!--
描述：国家考试信息-新增组件
开发人：hqj
开发日期：2019年03月05日
-->
<template lang="pug">
    el-dialog.dialog-form(bizKey="nationalExam" ref="kalixBizDialog" v-bind:title="title" v-bind:visible.sync="visible"
    v-bind:append-to-body="true" v-bind:close-on-click-modal="false" v-bind:before-close="close")
        el-form(ref="dialogForm" v-bind:model="formModel" label-width="80px")
            el-steps(v-bind:active="active" finish-status="success")
                el-step(title="录入试题")
                el-step(title="题库排重")
            div(v-if="active===1")
                div.s-flex
                    el-form-item.s-flex_item(label="主观题类型" prop="subType" v-bind:rules="rules.subType" v-bind:label-width="labelWidth")
                        kalix-dict-select(v-model="formModel.subType" appName="enrolment" dictType="主观题类型" disabled)
                div.s-flex
                    el-form-item.s-flex_item(label="年份" prop="year" v-bind:rules="rules.year" v-bind:label-width="labelWidth")
                        kalix-date-picker(v-model="formModel.year" type="year")
                div.s-flex
                    el-form-item.s-flex_item(label="学期" prop="term" v-bind:rules="rules.term" v-bind:label-width="labelWidth")
                        kalix-dict-select(v-model="formModel.term" appName="enrolment" dictType="学期")
                div.s-flex
                    el-form-item.s-flex_item(label="题干" prop="stem" v-bind:rules="rules.stem" v-bind:label-width="labelWidth")
                        el-input(v-model="formModel.stem" type="textarea")
                div.s-flex
                    el-form-item.s-flex_item(label="提交要求" prop="answerConstraint" v-bind:label-width="labelWidth")
                        el-input(v-model="formModel.answerConstraint" type="textarea")
                div.s-flex
                    el-form-item.s-flex_item(label="试题描述" prop="analysis" v-bind:label-width="labelWidth")
                        el-input(v-model="formModel.analysis" type="textarea")
                div.s-flex
                    el-form-item.s-flex_item(label="评分标准" prop="scoreStandard" v-bind:label-width="labelWidth")
                        el-input(v-model="formModel.scoreStandard" type="textarea")
            div(v-if="active===2" style="height:300px;position:relative;overflow:scroll")
                keep-alive
                    div.kalix-wrapper()
                        div.kalix-wrapper-hd
                            i(v-bind:class="iconCls") 重复试题列表
                        div.kalix-wrapper-hd
                            el-table(v-bind:data="repeateList" empty-text="无重复试题" border)
                                el-table-column(prop="id" label="ID" align="center" width="80px")
                                el-table-column(prop="stem" label="题干" align="center" width="350px")
                                    template(slot-scope="scope")
                                        el-popover(trigger="hover" placement="top" width="350")
                                            | {{scope.row.stem}}
                                            div(slot="reference")
                                                template(v-if="scope.row.stem && scope.row.stem.length > 20")
                                                    | {{scope.row.stem.substr(0, 20)}}...
                                                template(v-else)
                                                    | {{scope.row.stem}}
                                el-table-column(prop="createBy" label="创建者" align="center" width="120px")
                                el-table-column(prop="creationDate" label="创建时间" align="center" width="180px")
                                    template(slot-scope="scope")
                                        i(class="el-icon-time")
                                        span {{scope.row.creationDate}}
                                el-table-column(prop="checkFlag" label="审核状态" align="center" width="120px")
                                    template(slot-scope="scope")
                                        template(v-if="scope.row.checkFlag === '1'")
                                            el-tag(type="success") 已通过
                                        template(v-else-if="scope.row.checkFlag === '2'")
                                            el-popover(trigger="hover" placement="top" width="120")
                                                | 审核未通过原因
                                                br
                                                | {{scope.row.checkReason}}
                                                div(slot="reference")
                                                    el-tag(type="danger") 未通过
                                        template(v-else)
                                            el-tag 未审核
                                el-table-column(prop="checker" label="审核员" align="center" width="120px")
                                el-table-column(prop="checkDate" label="审核时间" align="center" width="180px")
                                    template(slot-scope="scope")
                                        i(class="el-icon-time")
                                        span {{scope.row.checkDate}}
                                el-table-column(prop="similarityDesc" label="相似度" align="center" width="200px")
            div
                el-button(v-on:click="cancel") 取消
                template(v-if="active===1")
                    el-button(v-on:click="next") 下一步
                template(v-if="active===2")
                    el-button(v-on:click="prev") 上一步
                    el-button(v-on:click="save") 保存
                    el-button(v-if="isEdit === false" v-on:click="saveAndContinue") 保存并继续
</template>

<script type="text/ecmascript-6">
    import FormModel from './model'
    import {AllRepeateURL, SubjectRepeateURL, SubjectURL} from '../../../config.toml'

    export default {
        name: 'NationalExamNewAdd',
        data() {
            return {
                title: '',
                visible: false,
                isEdit: false,
                active: 1,
                formModel: Object.assign({}, FormModel),
                rules: {
                    subType: [{required: true, message: '请选择主观题类型', trigger: 'change'}],
                    year: [{required: true, message: '请选择年份', trigger: 'change'}],
                    stem: [{required: true, message: '请输入题干', trigger: 'blur'}]
                },
                targetURL: SubjectURL,
                labelWidth: '120px',
                iconCls: '',
                isCompare: true,
                showRepeateURL: SubjectRepeateURL,
                repeateList: []
            }
        },
        components: {},
        created() {
        },
        watch: {
            formModel: {
                handler: 'watchFormModel',
                deep: true
            }
        },
        methods: {
            watchFormModel(newValue, oldValue) {
                if (this.isEdit && newValue.compareFlag === '1' && this.currentStem === newValue.stem) {
                    this.isCompare = false
                } else {
                    this.isCompare = true
                }
            },
            open(_title, isEdit = false, row) {
                this.title = _title
                this.visible = true
                this.isEdit = isEdit
                if (row) {
                    this.formModel = row
                    this.currentStem = row.stem
                } else {
                    this.formModel = Object.assign({}, FormModel)
                }
            },
            prev() {
                --this.active
                if (this.active < 1) this.active = 1
            },
            next() {
                if (this.active === 1) {
                    this.$refs.dialogForm.validate((valid) => {
                        if (valid) {
                            if (this.isCompare) { // 需要新比对
                                const loading = this.$loading({
                                    lock: true,
                                    text: '题库排重查询中...',
                                    spinner: 'el-icon-loading',
                                    background: 'rgba(255, 255, 255, 0.7)'
                                })
                                this.axios.request({
                                    method: 'POST',
                                    url: this.showRepeateURL,
                                    data: {
                                        'questionId': this.formModel.id,
                                        'stem': this.formModel.stem,
                                        'subType': this.formModel.subType
                                    },
                                    params: {}
                                }).then(response => {
                                    if (response.data.data) {
                                        if (response.data.data.length > 0) {
                                            this.repeateList = response.data.data
                                        } else {
                                            this.repeateList = []
                                        }
                                    } else {
                                        this.$KalixMessage.error('查询出错！')
                                    }
                                    loading.close()
                                })
                            } else { // 查询原有比对
                                const loading = this.$loading({
                                    lock: true,
                                    text: '题库排重查询中...',
                                    spinner: 'el-icon-loading',
                                    background: 'rgba(255, 255, 255, 0.7)'
                                })
                                this.axios.request({
                                    method: 'GET',
                                    url: AllRepeateURL + '/' + this.formModel.id,
                                    data: {},
                                    params: {
                                        jsonStr: '{"questionType":"5","firstQuestionId":' + this.formModel.id + '}',
                                        start: 0,
                                        page: 1,
                                        limit: this.$KalixGlobalConfig.PageConfig.limit
                                    }
                                }).then(response => {
                                    if (response.data.data) {
                                        if (response.data.data.length > 0) {
                                            this.repeateList = response.data.data
                                        } else {
                                            this.repeateList = []
                                        }
                                    } else {
                                        this.$KalixMessage.error('查询出错！')
                                    }
                                    loading.close()
                                })
                            }
                            if (this.active++ > 1) this.active = 1
                        } else {
                            this.$KalixMessage.error('请检查输入项！')
                            return false
                        }
                    })
                } else {
                    if (this.active++ > 1) this.active = 1
                }
            },
            save() {
                if (this.repeateList && this.repeateList.length > 0) {
                    let warnInfo = '可能存在重复试题，确定要保存吗？'
                    this.$confirm(warnInfo, '警告', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.doSave()
                    })
                } else {
                    this.doSave()
                }
            },
            saveAndContinue() {
                if (this.repeateList && this.repeateList.length > 0) {
                    let warnInfo = '可能存在重复试题，确定要保存吗？'
                    this.$confirm(warnInfo, '警告', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        this.doSaveAndContinue()
                        this.doClearForm()
                    })
                } else {
                    this.doSaveAndContinue()
                    this.doClearForm()
                }
            },
            // 取消操作
            cancel() {
                this.doClearForm()
                this.doCloseDialog()
            },
            close() {
                this.doClearForm()
                this.doCloseDialog()
            },
            doSave() {
                const loading = this.$loading({
                    lock: true,
                    text: '试题保存中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(255, 255, 255, 0.7)'
                })
                this.axios.request({
                    method: this.isEdit ? 'PUT' : 'POST',
                    url: this.isEdit ? `${this.targetURL}/${this.formModel.id}` : this.targetURL,
                    data: this.formModel,
                    params: {}
                }).then(response => {
                    if (response.data.success) {
                        this.$KalixMessage.success(response.data.msg)
                    } else {
                        this.$KalixMessage.error(response.data.msg)
                    }
                    loading.close()
                    this.doClearForm()
                    this.doCloseDialog()
                })
            },
            doSaveAndContinue() {
                const loading = this.$loading({
                    lock: true,
                    text: '试题保存中...',
                    spinner: 'el-icon-loading',
                    background: 'rgba(255, 255, 255, 0.7)'
                })
                this.axios.request({
                    method: this.isEdit ? 'PUT' : 'POST',
                    url: this.isEdit ? `${this.targetURL}/${this.formModel.id}` : this.targetURL,
                    data: this.formModel,
                    params: {}
                }).then(response => {
                    if (response.data.success) {
                        this.$KalixMessage.success(response.data.msg)
                    } else {
                        this.$KalixMessage.error(response.data.msg)
                    }
                    loading.close()
                })
            },
            doClearForm() {
                this.$refs.dialogForm.resetFields()
                let subType = this.formModel.subType
                this.formModel = Object.assign({}, FormModel)
                this.formModel.subType = subType
                this.active = 1
            },
            doCloseDialog() {
                this.visible = false
                this.$KalixEventBus.$emit('nationalExam' + '-' + 'KalixDialogClose', null)
            }
        }
    }
</script>

<style scoped lang="stylus">
    .el-form
        padding 30px 70px 30px 20px
</style>
